<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<title>利用锚点制作电子相册</title>
	<link rel="stylesheet" href="./style.css">
</head>

<body>
	<div class="photo">
		<h1>电子相册</h1>
		<div class="pic-one">
			<!-- 锚点链接的使用 -->
			<img src="img/1.jpg" id="pic1">
			<img src="img/2.jpg" id="pic2">
			<img src="img/3.jpg" id="pic3">
			<img src="img/4.jpg" id="pic4">
			<img src="img/5.jpg" id="pic5">
			<img src="img/6.jpg" id="pic6">
			<img src="img/7.jpg" id="pic7">
			<img src="img/8.jpg" id="pic8">
		</div>
		<div class="pic-two">
			<a href="#pic1"><img src="img/1.jpg"></a>
			<a href="#pic2"><img src="img/2.jpg"></a>
			<a href="#pic3"><img src="img/3.jpg"></a>
			<a href="#pic4"><img src="img/4.jpg"></a>
			<a href="#pic5"><img src="img/5.jpg"></a>
			<a href="#pic6"><img src="img/6.jpg"></a>
			<a href="#pic7"><img src="img/7.jpg"></a>
			<a href="#pic8"><img src="img/8.jpg"></a>
		</div>
	</div>
</body>

</html>